<template>
	<view class="content">
		<button @click="toWorkList">开始学习</button>
		<!-- <view class="uni-padding-wrap"><view class="uni-title">完成日期：年月日</view></view> -->
		<div class="pickerBox">
			<picker-view :indicator-style="workPlan.indicatorStyle" @change="bindChangeWork" class="picker-view">
				<picker-view-column>
					<view class="item" v-for="(item, index) in workPlan.everyDayNumber" :key="index">{{ item }}个</view>
				</picker-view-column>
			</picker-view>
			<picker-view :indicator-style="workPlan.indicatorStyle" :value="workPlan.value" @change="bindChangeDay" class="picker-view">
				<picker-view-column>
					<view class="item" v-for="(item, index) in workPlan.completionDay" :key="index">{{ item }}天</view>
				</picker-view-column>
			</picker-view>
		</div>
	</view>
</template>

<script>
export default {
	data() {
		const count = '';
		let everyDayNumber = [];
		let everyNum = 1;
		let completionDay = [];
		let completionDays = '';
		const value = [3, 4, 3];
		const indicatorStyle = `height: 50px;`;
		return {
			workPlan: {
				count,
				everyDayNumber,
				everyNum,
				completionDay,
				completionDays,
				value,
				indicatorStyle
			}
		};
	},
	onLoad() {
		this.getWork();
		this.workPlan.completionDay[0] =12
		// this.bindChangeWork();
		// console.log(this.workPlan.everyDayNumber.val);
		
	},
	methods: {
		toWorkList() {
			uni.navigateTo({
				url: '/pages/work-list/work-list'
			});
		},
		bindChangeWork(e) {
			const val = e.detail.value;
			this.workPlan.everyNum = this.workPlan.everyDayNumber[val[0]];
			this.workPlan.completionDay[0] = Math.ceil(this.workPlan.count / this.workPlan.everyNum);
			// console.log('work', this.workPlan.completionDay[0]);
			// this.workPlan.completionDay.push(Math.ceil(this.workPlan.count / this.workPlan.everyNum));
		},
		bindChangeDay(e) {
			const val = e.detail.value;
			// this.workPlan.everyNum = (this.workPlan.everyNum = this.workPlan.count / this.workPlan.completionDays)
			this.workPlan.everyDayNumber[val[0]] = this.workPlan.everyNum;
			this.workPlan.completionDays = this.workPlan.completionDay[val[0]];
			// console.log('day',this.workPlan.completionDay[0]);
		},
		getWork() {
			uniCloud
				.callFunction({
					name: 'work-get-list',
					data: {
						skip: 0
					}
				})
				.then(data => {
					this.workPlan.count = [...this.workPlan.count, ...data.result.data].length;
					for (let i = 1; i <= this.workPlan.count; i++) {
						this.workPlan.everyDayNumber.push(i);
					}
					// console.log(this.workPlan.count/this.workPlan.everyNum);
				});
		}
	}
};
</script>

<style>
.content {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.picker-view {
	width: 750rpx;
	height: 600rpx;
	margin-top: 20rpx;
}
.item {
	line-height: 100rpx;
	text-align: center;
}
.pickerBox {
	display: flex;
	width: 100%;
}
</style>
